import Vue from "vue";

export default {
    //install方法vue会自动调用
    //插件是写一些全局可用的功能，和混合区别在于，混合是复用组件内的配置，混合既可以全局混合，也可以单独混合，插件则全局使用，不需要每次都引入
    install: function (Vue, x, y, z) {//形参接收的为Vue构造函数
        console.log(x, y, z);
        //定义全局过滤器
        Vue.filter("mySliceGlobal", function (str) {
            return str.slice(0, 4);
        });
        //定义全局指令  
        Vue.directive("demo", {
            bind: function (ele, binding) {
                ele.innerText = binding.value;
            },
            inserted: function (ele, binding) {
                alert("ok");
            },
            update: function (ele, binding) {
                ele.innerText = binding.value;
            }
        });
        //定义全局混合
        Vue.mixin(
            {
                data() {
                    return {
                        x: 100,
                        y: 99
                    }
                },
                mounted() {
                    console.log('hello');
                }
            }
        );
        Vue.prototype.hello = function () {
            console.log('你好呀！！！');
        }
    }

}

/*
## 插件

1. 功能：用于增强Vue

2. 本质：包含install方法的一个对象，install的第一个参数是Vue，第二个以后的参数是插件使用者传递的数据。

3. 定义插件：

    ```js
    对象.install = function (Vue, options) {
        // 1. 添加全局过滤器
        Vue.filter(....)
    
        // 2. 添加全局指令
        Vue.directive(....)
    
        // 3. 配置全局混入(合)
        Vue.mixin(....)
    
        // 4. 添加实例方法
        Vue.prototype.$myMethod = function () {...}
        Vue.prototype.$myProperty = xxxx
    }
    ```

4. 使用插件：```Vue.use()``` 在main.js中引入,在使用Vue.use使用 
 */